<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" href="font_2017946_s214p6oou4e/iconfont.css">
    <link rel="stylesheet" type="text/css" href="css/index.css" />
    <link rel="stylesheet" type="text/css" href="css/liebiao.css" />
</head>

<body>
    <div class="header">
        <div class="header-con">
            <div class="header-first">
                <ul>
                    <li><a href="" class="first">amigo账号登录</a></li>
                    <li><a href="http://10.35.162.123/jinlixiangmu/denglu.html">原账号登录</a></li>
                    <li><a href="http://10.35.162.123/jinlixiangmu/zhuce.html">注册</a></li>
                    <li><a href="" class="iconfont icon-gouwuche last">购物车(0)</a>
                        <div class="dtext">
                            您的购物车是空的，快去挑选喜欢的商品吧！
                        </div>
                    </li>
                </ul>
            </div>
            <img src="img/images/1_03.png" />
            <div class="login">
                <ul>
                    <li><a href="http://127.0.0.1:8848/jinlixiangmu/index.html">首页</a></li>
                    <li><a href="" class="titt">手机</a></li>
                    <li><a href="">配件</a></li>
                    <li><a href="">服务</a></li>
                    <li><a href="">下载</a></li>
                    <li><a href="">amigoOS</a></li>
                    <li class="dactor"><input id="goid" placeholder="输入搜索内容" />
                        <a href="" class="iconfont icon-search"></a>
                    </li>
                </ul>
            </div>
        </div>
    </div>






    <div id="list">
        <div id="list-con">
            <img src="img/images/05_1520212767352.jpg">
            <ul>
                <li>手机分类： <input type="checkbox" checked="true" />全部 <input type="checkbox" />智能手机 <input type="checkbox" />功能手机</li>
                <li>手机外观： <input type="checkbox" checked="true" />全部 <input type="checkbox" />触屏 <input type="checkbox" />直板 <input type="checkbox" />翻盖</li>
                <li>手机系列： <input type="checkbox" checked="true" />全部 <input type="checkbox" />M系列 <input type="checkbox" />S系列 <input type="checkbox" />天鉴系列 <input type="checkbox" />F系列 <input type="checkbox" />金刚系列&nbsp;&nbsp;<input type="checkbox" />其它机型</li>
                <li class="last">排序方式： <span class="iconfont icon-jiantou1">上架时间</span> <span class="iconfont icon-jiantou1">价格</span> <span class="iconfont icon-jiantou1
">销量</span><input type="checkbox" class="ack" />显示在售商品</li>

            </ul>
        </div>
    </div>
    <div id="list-son">
        <ul class="ul2">
            <li id="li" style="display: none;">
                <a href="xiangqing.html">
                    <img src="img/images/1333_thumb_G_1506390590934.jpg" class="img">
                    <h5 class="title">金立M7</h5>
                    <p class="pa">6.01英寸超清全面屏，内置双安全加密芯片</p>
                    <span class="one">¥2499</span></a>
                <div id="kan" <!-- style="display: none;" -->>
                    <span class="span1">6.01英寸超清全面屏，内置双安全加密芯片</span>
                    <p class="p1">查看详情</p>
                </div>
            </li>

        </ul>
    </div>


    <div id="lasts">
        <div id="lasts-con">
            <ul>
                <li><img src="img/images/D-_userAJAX_htdocs_二生三_img_金立_03.png"></li>
                <li><img src="img/images/金立_04.png"></li>
                <li><img src="img/images/D-_userAJAX_htdocs_二生三_img_金立_03.png"></li>
                <li><img src="img/images/金立_04.png"></li>
            </ul>
        </div>
    </div>
    <div class="fonterr">
        <div class="fonterr-con">
            <div class="one">
                <h5>关于金立</h5>
                <p>企业荣誉</p>
                <p>金立体验店</p>
                <p>代理商专区</p>
                <p>加入金立</p>
                <p>联系我们</p>
                <p>供应/服务商需求咨询</p>
            </div>
            <div class="two">
                <h5>新闻咨询</h5>
                <p>公司新闻</p>
                <p>媒体报道</p>

            </div>
            <div class="three">
                <h5>购物指南</h5>
                <p>购物流程</p>
                <p>支付方式</p>
                <p>配送说明及费用</p>
                <p>订单管理</p>
                <p>购买常见问题</p>
                <p>预置应用公示</p>
            </div>
            <div class="four">
                <h5>售后服务</h5>
                <p>售后政策</p>
                <p>售后服务网点</p>
                <p>上门维修</p>
                <p>签收须知</p>
                <p>物流查询</p>
            </div>
            <div class="five">
                <h5>关注我们</h5>
                <p class="iconfont icon-weibo">&nbsp;新浪微博</p>
                <p class="iconfont icon-tengxunweibo">&nbsp;腾讯微博</p>
                <p class="iconfont icon-qzone">&nbsp;QQ空间</p>

            </div>
            <img src="img/images/code.png" />
            <span>扫一扫关注微信</span>
        </div>
    </div>
    <div id="zuihou-con">
        <div id="zuihou">
            <ul>
                <li><span class="one">网站地图&nbsp;&nbsp;|</span><span>&nbsp;&nbsp;集团下属公司</span></li>
                <li>增值电信业务经营许可证：粤B2-20120350 粤ICP备05087105号 粤文网[2018]10835-3804号 粤文审[2012]196号</li>
                <li>Copyright &copy;2013 深圳市金立通信设备有限公司 版权所有.</li>
            </ul>
            <div id="imgs">
                <img src="img/images/sf.png">
                <img src="img/images/govIcon.gif" class="two">
                <img src="img/images/b.png">
            </div>
            <div class="last">中国/简体中文+</div>
        </div>
    </div>
</body>

</html>
<script src="jquery.min.js"></script>
<script type="text/javascript">
    // 	$(".last").mouseenter(function() {
    // 		$(".dtext").slideDown()
    // 	})
    // 	$(".dtext").mouseleave(function() {
    // 		$(".dtext").slideUp()
    // 	})

    // 点击单个商品发送请求
    $.ajax({
        url: "http://10.35.162.123:8080/libiaolist",
        success: function(data) {
            let list = JSON.parse(data);
            list.forEach(function(item) {
                let newli = $("#li").clone(true);
                newli.css("display", "block")
                newli.appendTo($(".ul2"))
                newli.attr("id", item.id)
                newli.find(".title").html(item.title)
                newli.find(".pa").html(item.pic)
                newli.find(".one").html('¥' + item.price)
                newli.find(".span1").html(item.text1)
                newli.find(".p1").html(item.text2)
                newli.find(".img").attr("src", item.img)



                newli.click(function() {
                        let id = item.id;
                        $.ajax({
                            url: `http://10.35.162.123:8080/click?id=${id}`,
                            success: function(data) {}
                        })
                    })
                    // 					$("#kan").mouseenter(function(){
                    //                     	$(this).css("display","block").fadeIn()
                    //                     })
                    // 					$("#kan").mouseleave(function(){
                    // 						$(this).css("display","none").fadeOut()
                    //                     })

            })

        }
    })
</script>